import React, { useState } from "react";
import { Cell } from "react-vant";
import { MyNavBar } from "../../../../components";
import { useNavigate } from "react-router-dom";
import style from "./style.module.scss";
import { useRequest } from "ahooks";
import { getDoctorById } from "../../../../api/my";
import { useAppSelector } from "../../../../store/hooks";

const Index: React.FC = () => {
  const navigate = useNavigate();
  const doctorId = useAppSelector((state) => state.user.doctor.doctorId);
  const sessionId = useAppSelector((state) => state.user.doctor.sessionId);
  // 获取医生信息数据
  const { data: doctorInfo = [] } = useRequest(async () => {
    const resp = await getDoctorById(doctorId, sessionId);
    return resp.result;
  });
  return (
    <div className={style.Profile_item}>
      <div className="navbar">
        <MyNavBar
          title=""
          leftArrow
          onClickLeft={() => navigate("/my")}
        ></MyNavBar>
      </div>
      {doctorInfo && (
        <div className={style.Profile}>
          <Cell.Group border={false}>
            <Cell title="真实姓名" value={doctorInfo.name} />
            <Cell title="所属医院" value={doctorInfo.inauguralHospital} />
            <Cell title="所属科室" value={doctorInfo.departmentName} />
            <Cell title="职称" value={doctorInfo.jobTitle} />
            <Cell title="个人介绍" label={doctorInfo.personalProfile} />
            <Cell title="擅长领域" label={doctorInfo.goodField} />
          </Cell.Group>
        </div>
      )}
      <div className={style.footer}>
        如需更改以上信息&emsp;请致电000-5967432
      </div>
    </div>
  );
};

export default Index;
